extends layout

block title
    title mkfree博客—关注于分享程序语言开发服务器运维知识博客
block meta
    meta(name="description" content="mkfree程序员休闲博客是一个专注于分享、探讨、交流的程序语言技术平台。博文偏重jave编程；java设计模式；网站架构，开发，运维与管理；分享国内外程序语言业界资讯和相关的工具和资源等。")
    meta(name="keywords" content="mkfree博客,mkfree,程序员博客,java设计模式 ,技术博客,java编程,网站架构师,shadowsocks,mongovue,Ubuntu qq,mongodb crud,wineqq,HK学习笔记")

block content
    div(class="index")
        div(class="container-fluid ")
            div(class="row ")
                div(class="banner banner-lg  visible-lg")
                    img(class="image" src="/images/index-bg.jpg")
                    div(class="div" )
                        h1(class="title") mkfree博客
                        p(class="description") 博客开源，基于nodejs express jade mysql co promise bootstrap3 editormd，喜欢nodejs的朋友可以玩玩。
                        p(class="description")
                            <a class="btn btn-default click-link"><i class="iconfont icon-read"></i> READMD</a>
                            <a class="btn btn-primary click-link" href="https://git.oschina.net/381895649/mkfree-blog" target="_blank"><i class="iconfont icon-gitoschinalogosmall"></i> 源代码</a>
                            <a class="btn btn-success click-link" target="_blank"><i class="iconfont icon-qq"></i> 381895649 HK</a>
                div(class="banner banner-md  visible-md")
                    img(class="image" src="/images/index-bg.jpg")
                    div(class="div")
                        h1(class="title") mkfree博客
                        p(class="description") 博客开源，基于nodejs express jade mysql co promise bootstrap3 editormd，喜欢nodejs的朋友可以玩玩。
                        p(class="description")
                            <a class="btn btn-default click-link"><i class="iconfont icon-read"></i> READMD</a>
                            <a class="btn btn-primary click-link" href="https://git.oschina.net/381895649/mkfree-blog" target="_blank"><i class="iconfont icon-gitoschinalogosmall"></i> 源代码</a>
                            <a class="btn btn-success click-link" target="_blank"><i class="iconfont icon-qq"></i> 381895649 HK</a>
                div(class="banner banner-sm  visible-sm")
                    img(class="image" src="/images/index-bg.jpg")
                    div(class="div")
                        h1(class="title") mkfree博客
                        p(class="description") 博客开源，基于nodejs express jade mysql co promise bootstrap3 editormd，喜欢nodejs的朋友可以玩玩。
                        p(class="description")
                            <a class="btn btn-default click-link"><i class="iconfont icon-read"></i> READMD</a>
                            <a class="btn btn-primary click-link" href="https://git.oschina.net/381895649/mkfree-blog" target="_blank"><i class="iconfont icon-gitoschinalogosmall"></i> 源代码</a>
                            <a class="btn btn-success click-link" target="_blank"><i class="iconfont icon-qq"></i> 381895649 HK</a>
                div(class="banner banner-xs  visible-xs")
                    img(class="image" src="/images/index-bg.jpg")
                    div(class="div")
                        h1(class="title") mkfree博客
                        p(class="description") 博客开源，基于nodejs express jade mysql co promise bootstrap3 editormd，喜欢nodejs的朋友可以玩玩。
                        p(class="description")
                            <a class="btn btn-default click-link"><i class="iconfont icon-read"></i> READMD</a>
                            <a class="btn btn-primary click-link" href="https://git.oschina.net/381895649/mkfree-blog" target="_blank"><i class="iconfont icon-gitoschinalogosmall"></i> 源代码</a>
        div(class="container blog-focus ")
            div(class="row")
                div(class="jumbotron ")
                    h3(class="title") #{focusBlogPost.title}
                    p(class="summary") #{focusBlogPost.summary}
                    p
                        a(class="btn btn-primary" href='/posts/#{focusBlogPost.old_id ? focusBlogPost.old_id : focusBlogPost.id}') 详情
        div(class="container blog-list")
            div(class="row")
                each item in newBlogPostList
                    div(class="col-lg-6 col-md-6 col-sm-6 col-xs-12")
                        div(class="thumbnail item")
                            //img(data-src="holder.js/300x300" alt="...")
                            div(class="caption")
                                h3(class="item-title") #{item.title}
                                p(class="item-p") #{item.summary}
                                p <a href="/posts/#{item.old_id ? item.old_id : item.id}" class="btn btn-primary" role="button">详情</a>
                <nav>
                <ul class="pager">
                <li><a href="/posts/list/1">更多</a></li>
                </ul>
                </nav>
